<template>
	<gui-page ref="guiPage" :customHeader="true">
		<template v-slot:gHeader>
			<nav-bar-custom left-icon="left" :title="$t('distributedEnter.scanRecord')"></nav-bar-custom>
		</template>
		<template v-slot:gBody>
			<view v-if="data.barcodeList.length == 0" class="noticeHooks">
				{{ data.barcodeList.length == 0 ? $t('stockManage.notAvailable') : $t('stockManage.without') }}
			</view>
			<view class="record-card" v-for="(item, index) in data.barcodeList" :key="`${item.barcode}` + `${index}`"
				v-else>
				<uni-icons class="close-icons" type="closeempty" color="#9C9C9C" size="30"
					@click="handelClosePopup(index, item)"></uni-icons>
				<view class="card-mini-head">
					<view class="title-line"></view>
					<text>{{ $t('translationImage.serialNumber') }}：{{ data.barcodeList.length - index }}</text>
				</view>
				<view class="custom-card-itemOne">
					<text class="item-info-title">{{ $t('distributedOut.barcode') }}：</text>{{ item.barcode }}
				</view>
				<view class="custom-card-itemOne">
					<text class="item-info-title">{{
						$t('multilingual.productionLine') }}：</text>{{ item.productionLine }}
				</view>
				<view class="custom-card-itemOne">
					<text class="item-info-title">{{ $t('distributedEnter.materialCode') }}：</text>{{ item.materialCode
					}}
				</view>
				<view class="custom-card-itemOne">
					<text class="item-info-title">{{ $t('distributedEnter.materialName') }}：</text>{{ item.materialName
					}}
				</view>
				<view class="custom-card-itemOne">
					<text class="item-info-title">{{ $t('distributedEnter.materialSpec') }}：</text>{{ item.specification
						|| ''
					}}
				</view>
				<view class="custom-card-itemOne">
					<view class="card-item-50"><text class="item-info-title">{{ $t('distributedEnter.uom') }}：</text>
						{{ item.unit }}</view>
					<view class="card-item-50">
						<text class="item-info-title">{{ $t('distributedEnter.qty') }}：</text>{{ item.qty }}
					</view>
				</view>
				<view class="custom-card-itemOne">
					<view class="card-item-50">
						<text class="item-info-title">{{ $t('distributedOut.warehouse') }}：</text>{{ item.warehouse }}
					</view>
					<view class="card-item-50">
						<text class="item-info-title">{{ $t('translationImage.process') }}：</text>{{ item.process }}
					</view>
				</view>
				<view class="custom-card-itemOne">
					<text class="item-info-title">{{ $t('distributedOut.location') }}：</text>{{ item.location }}
				</view>

				<view class="title-with-text">
					<text>{{ $t('equipmentRepair.Batch') }}</text>
				</view>
				<view class="custom-card-itemOne" v-for="(item, index) in item.tableDayS" :key="index">
					<text class="item-info-title">{{ $t('equipmentRepair.BatchRemarks') }}：</text>{{ item.day }}-{{
						item.month }}-{{ item.year }}-{{ item.remarks }}
				</view>
			</view>
		</template>
	</gui-page>
</template>

<script setup>
import { navigate } from '@/utils/routerSkip.js';
import { useStore } from "vuex";
import { basPdaOperationLogFn } from '@/utils/index.js';
import { OPERATION_DEL, OPERATION_LOOK } from '@/constant/index.js'
import {
	ref,
	reactive,
	onMounted,
	watch,
	computed,
	toRaw
} from 'vue';
let data = reactive({
	barcodeList: [],//条码数组
})
onMounted(() => {
	try {
		let inputParameter = '无'
		let returnParameter = JSON.stringify(data.barcodeList)
		let operationPicture = '成品补录'
		let callInterface = '无'
		let opertionParmes = {
			inputParameter,
			returnParameter,
			operationPicture,
			callInterface,
			responseCode: '无',//返回状态
			errorMessage: '无',//错误信息
			isPass: 'Y',//是否成功 Y N
			operationType: OPERATION_LOOK
		}
		basPdaOperationLogFn(opertionParmes)
	} catch (error) {
	}
})
let store = useStore();
data.barcodeList = computed(() => {
	return store.state.finishedProductAdditional
})
const handelClosePopup = (index, item) => {
	try {
		let inputParameter = JSON.stringify(item)
		let returnParameter = '无'
		let operationPicture = '成品补录'
		let callInterface = '无'
		let opertionParmes = {
			inputParameter,
			returnParameter,
			operationPicture,
			callInterface,
			responseCode: '无',//返回状态
			errorMessage: '无',//错误信息
			isPass: 'Y',//是否成功 Y N
			operationType: OPERATION_DEL
		}
		basPdaOperationLogFn(opertionParmes)
	} catch (error) {
	}
	store.commit('deleteFinishedProductAdditionalStorage', index)
}
</script>

<style lang="scss" scoped>
.title-with-text {
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 20rpx 0;
	color: #666;
	font-size: 26rpx;
	position: relative;

	&::before,
	&::after {
		content: '';
		flex: 1;
		height: 2rpx;
		background-color: #e0e0e0;
	}

	&::before {
		margin-right: 20rpx;
	}

	&::after {
		margin-left: 20rpx;
	}
}
</style>
